La primera es una idea de mi amiga Alemama, se trata de aplicar el código de la imagen en la plantilla de entrada, lo haremos así:
Opciones/Formato y bajar hasta la casilla Plantilla de entrada donde añadimos el código de la imagen para nuestro dividers :
La segunda es resultado de mi paciencia, también funciona que es lo importante.
Hay que dirigirse a Plantilla/Expandir plantilla de artilugios.
Buscamos la parte del código que dice:
<b:include data='post' name='post'/>
Justo después añadimos el código para imagen envuelto en <center> y <center> para centrar la imagen.
Quedaría más o menos así:
<b:include data='post' name='post'/>
<center><img src="aquí-la-url-de-la-imagen"/></center>
Otra opción más para añadir una barra divisora:
Nos situamos igualmente en:
<b:include data='post' name='post'/>
Y añadimos
<input src="url-de-tu-imagen" type="image"/>
El resultado sería como la imagen siguiente:
Hola, amiga, me alegro de que haya servido mi sencillo "truco"" ( que no lo es) para poner un lindo divider elegido entre los que has ido coleccionando para facilitar la tarea de muchos.
Un beso, Gema, y que siga tu muy buen sitio viento en popa.
Gracias a ti Ale por la aportación y los buenos deseos ;)
El dividers que ha servido de ejemplo es una creación de mi buen amigo Rafael Reina.
Gracias Rafael :)
Llegué algo tarde para comentar este post, pero también se puede (y creo que queda mejor) utilizar una etiqueta div en vez del antiguo parámetro center:
<div align="center"><img src="aquí-la-url-de-la-imagen"/></div>
Muchas gracias por el post, saludos,
Hola Mario ¿mejor en qué sentido?
Hola Gema:
Me olvidé de explicar: resulta que yo también usaba el atributo center, hasta que me enteré que no es un atributo XHTML válido (según el W3C), porque no define ningún contenido; en cambio las etiquetas p (párrafo) div (sección d contenido) y otras sí lo hacen y para centrar el contenido que generan solo basta usar la opción align "center".
En los tiempos de HTML 3 y 4 era común usar center solo, pero cuando cuando apareció HTML 5 y XHTML para el W3C pasó a tener más importancia definir el contenido de una página con la etiqueta que le corresponde.
Obviamente que usando el center también funciona, pero si te fijas al centrar algo en tu editor de textos de casi cualquier gestor de blog se utilizan las etiquetas correspondientes con la opción align para centrar, ubicar a derecha, izquierda o justificar.
No espero convencerte, solo quería comentarlo, me gusta respetar los estándares web (mejor dicho trato de hacerlo, porque a veces el código se hace tan extenso que es difícil hacer un seguimiento de todo.)
Bueno, espero haberme explicado bien, saludos y gracias por el truco (ya lo añadí a mi plantilla);-)
Hola Mario: Después de leerte me preguntaba ¿Qué busca un chico como tú en un blog como éste?
No te lo tomes a mal por favor pero después de esa clara y detallada explicación creo me queda mucho por aprender;)
Gema:
Yo aprendo un montón con tu blog, así que el ida y vuelta es mutuo, jeje ;-)
Gracias Mario ;)
Hola Gema.. he seguido los pasos de la sugerencia de alemama y no ha dado resultado, por otro lado, hice lo que tu sugieres y queda bien, pero tengo un problema, ahora aparecen los dos dividers el que tenia la pagina y el que yo he puesto, como borro el anterior???
Hola Cielo vamos a intentar eliminar esa línea de separación en las entradas.
Busca en tu plantilla lo siguiente:
/* ---( main column )--- */
y donde dice border-bottom: 1px sustituye el 1 por 0
Mira en vista previa antes de guardar los cambios y dime si desaparece la línea (me he guiado por el código fuente de tu blog y no es lo mismo que hacerlo con la plantilla)
Hola Gem@ ha funcionado a la perfección... muchas gracias!!!
Pero me ha surgido una duda, hace un rato que publique un post al elegir nueva entrada aparece la imagen del divider en la nueva entrada...
es ese tu truco?? porque me resulta algo raro... ya que en los dividers anteriores no sucede esto... :S
y otra cosa (todo quiero sorry) el divider que acabo de poner, esta muy hacia el título del post hay manera de separar esa distancia?? entre el título y el divider??
Un gran abrazo y gracias pro todo!
Ese es el efecto del truco de Alemama, al añadir el código en la plantilla de entrada aparece en todas las entradas.
Si añades el divider con mis explicaciones saldrá más centrado y queda archivado en la plantilla, no aparece en las entradas ;)
gracias Gemita!!!
un gran abrazo!
Tengo una duda (yo como siempre rizando el rizo, jeje).
¿Como podría poner un divider para separar la sidebar de la mainbar?
Gracias y, como siempre, un saludo,
JmpaSrgc
JmpaSrgc tu siempre vas más allá de donde yo he llegado jajajaja
He visto algo sobre eso pero no he probado, se trata de adaptar un marco a la sidebar de manera que el lado que "toca" el main tiene un valor de "border1" mientras los demás tienen 0.
No puedo ser más explicita porque no recuerdo donde lo he visto.
"El que se entere antes informa como hacemos siempre ;) "
Yo también he seguido vuestras indicaciones y he añadido una "nota de color" más... muchísimas gracias, de nuevo...
jajaja Veo que te diste una vuelta por los dividers :)
En mi blog hay este código,¿es lo mismo? b:include data='blog' name='all-head-content'/
Hola Gema, este truco es muy bueno, acabo de poner un gatito corriendo en blog ;) gracias
Genial siento no haber visto antes este comentario, de todas formas no me dejaste enlace a tu blog no puedo saber la plantilla que estás usando :(
Hola Pau está lindo ese gatito, alegra mucho la página ;)
Hola Gema, te hago una consulta:
Ya lo agregué en mi blog,
http://elblogazodelcomic.blogspot.com/
pero entre cada entrada a veces queda muy encima del titulo de la siguiente entrada.
¿Cómo puedo hacer para regular la distancia del divider si quiero que este más cerca de la entrada de arriba, de la de abajo, o en el medio exacto?
Gracias de antemano y perdón por la molestia.
Hola Gem@!! Siempre útiles y super didacticas tus explicaciones!!
Muchas gracias. Tengio tu blog en mis marcadores y cada vez que tengo tiempo, añado alguna cosita a is blogs.
Hoy estuve "jugando" con los dividers, los había visto el año pasado, pero nunca me tomé el tiempo. Quedaron re lindos!!
Sóle te pregunto de cargosa nomás, se pueden hacer mas anchos? o sea, que la imagen ocupe el ancho de la columna?
Otra cosita: se podría quitar el borde de las imágenes?
Te dejo la s direcciones de los blogs donde los puse.
http://valentinagunski.blogspot.com
http://kruchowski.blogspot.com
Mil gracias por tu ayuda!!
Cariños.
Silvia
Bienvenida Silvia, te felicito por esa preciosidad llamada Valentina ;)
Los dividers no pueden ensancharse a no ser que se haga con un editor de imágenes, he mirado tu plantilla y en espacio de tus entradas mide 400px; así qu ehe probado con mi editor para ver como quedaba la imagen en esa medida, pierde un poco de nitidez pero si quieres puedes añadirla en lugar de la que tienes para que tal queda.
Esta es la imagen , puedes copiar la dirección y pegarla en lugar de la otra:
http://img175.imageshack.us/img175/7697/bearline6ql4.png
Para eliminar los bordes en las imágenes de "Abuela Beauty" busca en la plantilla:
h2.date-header {
y border-bottom:1px lo cambias por 0 (cero)
Lo mismo haces en:
.post img {
y en ...
.profile-img {
Si ha quedado algún borde más me lo recuerdas que mire donde debes eliminarlo ;)
Graciassss!!! Me quedaron re bien!!
Tanto los dividers con la nueva que me mandaste, como la cuestión de los bordes de las imágenes. De paso, y siguiendo tus indicaciones en otro comentario, tambiém eliminé las líneas de separación de la sidebar.
Viste que hermosa mi nieta Valentina??
Gracias a ella empecé con los blogs jaja. Pero no tengo todo el tiempo que quisiera para que este mas lindo y más actualñizado!! La gorda crece todos los días y siempre faltan posteos.
Muchos cariños Gem@..y seguro te estaré molestandfo con alguna otr cuestión un dia de estos.
Estupendo Silvia, aquí estaré para cuando me necesites ;)
¡Gracias Gema!
Revisando el blog de Karyne, he dado con tu página y me ha parecido estupendo.
Quería colocar divisores de entradas y siguiendo tus instrucciones lo he logrado. Gracias.
Quería enlazarte a mi blog, y el logotipo (creo que se llama así) que me gustó fue el rectangular, pero sólo me sale el cuadrado. Quisiera saber cómo hago para enlazar el rectangular. Gracias por compartir tus conocimientos.
Saludos y bienvenida Ángeles, he solucionado el problema para enlazarme, gracias por decírmelo ;)
Sólo tienes que hacer click y escoger el blog donde vas a añadirlo si fuera más de uno.
Un millón de gracias Gema.
Ya he podido enlazar tu logotipo rectangular. Quedó muy bien. Además, coloqué el Blogoversary, para saber con exactitud cuántos días faltan para el 1er Aniversario. De nuevo, ¡Gracias! Con calma iré revisando tus archivos, para seguir mejorando mi blog. ¡Gracias, por seguir ayudando!
Estupendo Ángeles estaré encantada de verte por aquí ;)
Hola Gema!
Hace un tiempo atrás descubri tu blog y me ha servido bastante tu ayuda para completar mi blog.
Pero sabes, tengo un problema, en una plantilla puse agregar el divider, pero cambie a otra y no me queda muy bien, como hago para que me quede dentro del mismo post? Porque me queda afuera y se ve muy mal, porque no le combina con el color del fondo.
Espero que me puedas ayudar.
De antemano muchas gracias.
Sidhe... para que quede dentro del post lo mejor sería añadir la imagen en las entradas.
Para que esa tarea no se haga pesada lo ideal es añadir la imagen en la plantilla de entrada en este orden:
Opciones/Formato y bajar hasta la casilla Plantilla de entrada una vez ahí añades lo siguiente:
<img src="url-de-la-imagen"/>
Donde url de la imagen debes añadir la url dela imagen del dividers ;)
Cualquier duda házmelo saber
Gema.. gracias por responderme xD!
Te cuento, opte por colocar el divider en la entrada. Porque si lo hago del otro modo, la imagen me queda rara con el fondo (plomo) en cambio en la entrada (que es blanca) queda mejor.
Ahora tengo otro problemita. En la plantilla no me aparece esos datos que salen debajo del una entrada: "comentado por" "a las", etc etc. ¿Qué puedo hacer para agregarlos?
Eso sería por el momento.
Saludos
Y gracias
Sidhe and accediendo por Configuración/Entradas del blog hay un enlace para "Editar" desde ahí puedes añadir esos datos marcando la casilla que corresponda.
Es raro que no aparezca sin tener que marcar nada ¿qué plantilla usas?
Holis!
Ya marqué esos datos Gema, de hecho fue lo primero que hice, pero aún así no me aparecen. Estoy usando la plantilla "conexion" la obtuve de esta web http://www.bloggerbuster.com/2008/08/125-more-excellent-blogger-templates.html
¿Me aconsejas que utilizé otra?
Bye y gracias :)
Sidhe si te gusta esa plantilla y después de los cambios que realizaste no veo el motivo de cambiarla, eso es a gusto del autor.
Si la opción que te di no ha funcionado entonces lo único que puedo hacer es que me mandes una copia de la plantilla en archivo xml para intentar ver el problema :)
Tengo un Blog y he aplicado tu codigo y funciona perfecto. Pero me gustaría saber cómo puedo hacer para dividir cada entrada para que el fondo de las mismas que es de color verde, también se separe unas de otras y quede únicamente el fondo del blog. Si quieres te puedo añadir la dirección del mismo para que lo "veas mejor".
Muchas gracias y enhorabuena por tu magnífico trabajo.
Hola Carcamal ya he visto tu blog, y lo que debes hacer es lo siguiente:
Ese color verde que unifica todas las entradas lo tienes añadido en #main-wrap1 { tienes que eliminar esta línea de código:
background:#11593C url("") no-repeat left bottom;
Luego buscar donde dice .post { y justo después añadir: background:#11593C;
Haciendo eso el color verde sólo aparece como fondo de las entradas mira en vista previa y me dices si hay algún problema :)
Hola de nuevo Gema y gracias por contestar tan rápido.
No me aparece esa linea que me comentas, tengo esta otra otra:
#main-wrap1 {
width:630px;
float:$startSide;
background:$mainBgColor url("") no-repeat $startSide bottom;
margin:15px 0 0;
padding:0 0 10px;
color:$mainTextColor;
font-size:97%;
line-height:1.5em;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
Alguna idea ? Muchas gracias.
Justo ahí
Yo lo veo en el código fuente de esta foma:
background:#11593C url("") no-repeat left bottom;
Pero puedes eliminar la línea de:
backgroundmainBgColor url("") no-repeat $startSide bottom;
Seguramente saldrán emoticones pero te harás una idea.
Perfecto Gema, ya lo tengo cambiado !!! Al principio no salía ningún color de fondo en la entrada... pero luego leí tu anterior comentario que también había que copiar la misma línea eliminada a la entrada de .post }
Muchas gracias por tu gran ayuda. Un saludo.!
hola yo tengo dos blogs,y uno de ellos lo tengo para realisar pruebas,hoy a dicho blog le cambie la plantilla y este no tiene ningun divider y e tratado de ponerle uno,de todas las maneras que tu explicastes y no he logrado nada con nignuna,no se si es la plantilla que no los acepta o es algo que estoy haciendo mal (que es lo probable).
El blog el que como titulo dice p4blq,desde ya muchas gracias.
Gracias por avisar Carcamal :)
Hola PABLO envíame la plantilla a mi correo a poder ser en formato xml recordándome el problema y vemos la solución :)
Hola de nuevo Gema !!!
Un poquito más arriba me ayudaste a dividir las entradas de mi blog. Desde hace un par de días me aparecen unas lineas verticales en las entradas que no sé a que se deben pues no he tocado nada.
Por favor, podrías echarme una mano ?
Un saludo y muchas gracias.
Bueno Gema, al final pude solucionarme el tema que te expuse arriba de las entradas.
Muchas gracias
uyss hoy me odiaras.... otra que me va... gracias a ti, en el formato anterior no encontre en mi plantilla lo de $BlogItem... pero este metodo va a la perfección, te lo agradezco.
Carcamal lo siento muchooooooooo no había visto tu comentario hasta ahora ¿por qué no me lo recordaste?
Juno eso no puedes encontrarlo porque sólo está en las plantillas clásicas :O
ahh vaya :$ !!, buen punto :P, pero de todas maneras, gracias a esta segunda opción publicada por ti, me va ;) !! Gracias mil :D
Entonces estupendo :)
hola gem@!!! fuera de los dividers en la sidebar (solid, sencillos) he resuelto todos los otros problemas que te comentaba. he logrado separar las dos sidebares incluso. eres una genia. ya te lo han dicho ¿verdad? besazos (te lo comento para que no te molestes en contestarme aunque ya estarás a punto de hacerlo o que ya lo has hecho, vaya!) MIL GRACIAS
Ya estaba contestado pero es igual a lo mejor es útil para alguien ;)
Hola Gem@ yo hice la tercera opcion que tu diste, y no me sale nada, que habrá pasado?
Pitu comprueba que el código lo añadiste bien y no has omitido nada o que la url de la imagen esté completa ;)
Gem@ no me sale tengo 4 blogs en uno me sale y en los otros no y lo hago igual ¿que puede pasar? gracias
NOSOTRAS, sin son diferentes plantillas puede ser ese el motivo, intenta dejar la imagen donde dices que no se ve y me avisas que mire por si viera el error si es que lo hay ;)
Gracias por hacernos mas facil las modificaciones de nuestros blogs. He insertado la barra divisoria pero no consigo que salga al final, sino entre el link de comentarios y las etiquetas.
¿Me ayudas?, Gracias.
Laura
Saludos Patchwork Art Sbd prueba a añadirla justo después de:
<div class='post-footer-line post-footer-line-4'>
Mira en vista previa si se añade después de las etiquetas.
Gracias Gema Me sirvio esta ayuda....oye sabes como Hacer un poco mas grande el titul de mis posts....puse en Fuentes y Colores y no me aparecen los cuadros de colores y eso...sabes como modificarlo mediante el codigo Html???
este es mi blog
http://kronos-corp.blogspot.com/
yz ¿De qué blog hablamos Kronos?
Gracias por responder Gem@ el blog es el siguiente
Kronos Corp
alli arriba puse la direccion
Espero y hayas visto mi respuesta anterior
yz No me di cuenta Kronos Corp. prueba en:
.post h3 a {
font-size: 14pt;
font-weight: bold;
text-decoration: none;
color: #000;
letter-spacing: -1px;
}
Gracias me sirvio de lujo....Un Saludo
yz Genial ;)
hola Gema por fin pude poner un divisor en los pots siuiendo tu dato, muchas gracias, con el truco de Alemama no resulto: sin embargo me sale igual el antiguo divisor, esos puntitos del blog, como hago para borrarlos, vi en uan rspuesta que se debia buscar* ---( main column )--- */ pero no lo encontre me queme las pestañas buscandolo uan y utra vez y nada y ahi sigo con los divisores, helppppp!!! plis!!!!.
Ah y como hago para que quede al final del post y no como cabecera del anteriosr, no se si me explico y si no visita ki blog http://angelysusproyectos.blogspot.com
Hola Gema, es la primera vez que te consulto.
Siguiendo tus indicaciones he conseguido poner un divisor entre los post, que copié del que separa la cabecera.
Mi problema es que hay otro divisor en la plantilla que quiero eliminar, entre el texto del post y el "publicado por".
¿Podrías ayudarme?
El blog para el que necesito ayuda es
http://profesionalizacionedambiental.blogspot.com
Mil gracias
yz Ángel la barra divisora no se localiza en todas las plantillas igual, por ejemplo en la tuya debes buscar donde dice:
.post {
margin:.5em 0 1.5em;
border-bottom:1px dotted #e1771e;
padding-bottom:1.5em;
}
Suprimiendo la línea en negrita desaparecerá ese punteado. Paa que quede más alta puedes probar a añadirla en lugar de post-footer-line-3 donde dice post-footer-line-2 puedes ir mirando en vista previa :)
yz Hola Susana, esa línea la encontrarás en el siguiente código de tu plantilla:
.post-footer {
font-family: Verdana, sans-serif;
font-size:74%;
border-top:1px solid #BFB186;
padding-top:6px;
}
Si eliminas la línea que he marcado en negrita desaparecerá :)
Muchas gracias Gema ¡Que rapidez!
Acabo de aplicarlo y queda como yo quería. Todavía me queda mucho por tunear, pero poco a poco y con tu ayuda y la de Rosa (a la que ya tengo exprimida) voy aprendiendo de esto.
:D
yz La rapidez es producto de la causalidad Susana :)
Gema te pasate por tu ayuda ahora si que si, igual tengo mucho que amononar, asi que seguire tus consejos y sugerencias.
Cariños mil
No se si te has dado cuenta que el enlace que has dejado redirecciona a un blog que se llama divider
concretamente a este http://dividers.blogspot.com/
yz Suerte Ángel :D
yz MªJose no me había dado cuenta, o mejor dicho lo enlacé pensando en otro blog :O
Gracias Gema por poner temas como este y como todos los qu expones en tu blog ya que son mucho mas que una ayuda porque aprendemos un poquito cada día. Besitos
yz Gracias a ti por comentar Diana.
(Precioso bebé) :D
Nota: solo los miembros de este blog pueden publicar comentarios.